<template>
  <div class="settings-panel">
    <div class="settings-content">
      <h3>系统设置</h3>
      <p>设置功能开发中...</p>
      <el-button @click="closeSettings">关闭</el-button>
    </div>
  </div>
</template>

<script setup>
import { useAppStore } from '@/stores/app'

const appStore = useAppStore()

const closeSettings = () => {
  appStore.toggleSettings()
}
</script>

<style scoped>
.settings-panel {
  position: fixed;
  top: 0;
  right: 0;
  width: 300px;
  height: 100vh;
  background: white;
  box-shadow: -2px 0 6px rgba(0, 0, 0, 0.1);
  z-index: 1000;
}

.settings-content {
  padding: 20px;
}
</style>